<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html 	xmlns="http://www.w3.org/1999/xhtml"
		xmlns:ui="http://java.sun.com/jsf/facelets"
		xmlns:h="http://java.sun.com/jsf/html"
		xmlns:f="http://java.sun.com/jsf/core"
		xmlns:fn="http://java.sun.com/jsp/jstl/functions"
		xmlns:p="http://primefaces.prime.com.tr/ui">

<h:head>
	<h:title></h:title>
	<style type="text/css" >
		.ui-widget {
		    font-size: 11px !important;
		}
		.ui-selectonemenu {
			top: 5px;
		}
		.ui-fileupload-browser {
			width: 138px;
			height: 24px;
		}
	</style>
	<script type="text/javascript" src="resources/js/jquery.price_format.1.5.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$('.number').priceFormat({prefix: '', centsSeparator: '.', thousandsSeparator: '', limit: 8, centsLimit: 2});
		});
	</script>
</h:head>
	<h:body>
		<h:form enctype="multipart/form-data" id="floorForm" prependId="false">
			<div id="header">
			    <ui:insert name="header">
			    	<ui:include src="/domotic/resources/templates/header.xhtml"/>
			    </ui:insert>
			</div>
			
			<div id="content">
				<p:panel header="Cadastro de Andares" style="min-height: 410px;">
					<h:panelGrid columns="2" id="panelGrid">
						<span>Código: </span>
						<h:panelGroup>
							<p:inputText id="floorId" value="#{floorController.bean.floorId}"></p:inputText>
						</h:panelGroup>
						<span>Nome: </span>
						<p:inputText id="floorName" maxlength="80" size="60" value="#{floorController.bean.floorName}"></p:inputText>
						
						<span>Residência: </span>
						<p:selectOneMenu id="home" style="width: 200px;" value="#{floorController.bean.home.homeId}">
							<f:selectItem itemLabel="Select One" itemValue="" />
							<f:selectItems value="#{homeController.all}" var="home" itemLabel="#{home.homeName}" itemValue="#{home.homeId}"/>
						</p:selectOneMenu>
						
						<span>Andar Nº: </span>
						<p:inputMask id="floorLevel" mask="?99" value="#{floorController.bean.floorLevel}"></p:inputMask>
										
						<span>Área Total: </span>
						<h:panelGroup>
							<p:inputText id="floorArea" maxlength="10" styleClass="number" value="#{floorController.bean.floorArea}"></p:inputText>
							<span> m²</span>
						</h:panelGroup>
					</h:panelGrid>
					<div style="min-height: 6px;" />
					
					<p:commandButton id="searchButton" value="Consultar" actionListener="#{floorController.findByFilter}" update="messages, searchBeans"></p:commandButton>
					<p:commandButton id="searchAllButton" value="Listar Todas" actionListener="#{floorController.findAll}" update="messages, searchBeans"></p:commandButton>
					<div style="min-height: 6px;" />
					
					<span><font color='red'>Filtro:</font></span>
					<p:dataTable id="searchBeans" var="floor" value="#{floorController.searchBeans}" emptyMessage="Nenhum registro encontrado" loadingMessage="Buscando...">
						<f:facet name="header">Lista de Residências</f:facet>
						
						<p:column headerText="Código">
							<h:outputText value="#{floor.floorId}" />
						</p:column>
						
						<p:column headerText="Nome">
							<h:outputText value="#{floor.floorName}" />
						</p:column>
						
						<p:column headerText="Área(m²)">
							<h:outputText value="#{floor.floorArea}" />
						</p:column>
						
						<p:column headerText="Residência">
							<h:outputText value="#{floor.home.homeName}" />
						</p:column>
						 
						<p:column headerText="Ações">
							<p:commandButton title="Editar" oncomplete="updateConfirmation.show();" image="ui-icon ui-icon-pencil">
								<f:setPropertyActionListener target="#{floorController.selectedBean}" value="#{floor}" />
							</p:commandButton>
							
							<p:commandButton title="Excluir" oncomplete="deleteConfirmation.show();" image="ui-icon ui-icon-close">
								<f:setPropertyActionListener target="#{floorController.selectedBean}" value="#{floor}" />
							</p:commandButton>
						</p:column>
						
						<f:facet name="footer">Foi(ram) encontrado(s) #{fn:length(homeController.searchBeans)} andar(es).</f:facet>
					</p:dataTable>
					
					<p:confirmDialog message="Tem certeza que deseja editar esse andar?" header="Confirmação" severity="alert" modal="true" widgetVar="updateConfirmation">
						<p:commandButton value="Sim" update="messages" oncomplete="updateConfirmation.hide();" action="#{floorController.updateAction}" ajax="false"/>
						<p:commandButton value="Não" onclick="updateConfirmation.hide();" type="button" />
					</p:confirmDialog>
					
					<p:confirmDialog message="Tem certeza que deseja excluir esse andar?" header="Confirmação" severity="alert" modal="true" widgetVar="deleteConfirmation">
						<p:commandButton value="Sim" update="messages, searchBeans" oncomplete="deleteConfirmation.hide();" actionListener="#{floorController.deleteAction}" />
						<p:commandButton value="Não" onclick="deleteConfirmation.hide();" type="button" />
					</p:confirmDialog>
					<p:growl life="3000" showDetail="true" id="messages"></p:growl>
				</p:panel>
			</div>
			
			<div id="footer">
			  <ui:insert name="footer">
					<ui:include src="/domotic/resources/templates/footer.xhtml"/>
			  </ui:insert>
			</div>
		</h:form>
	</h:body>
</html>